<!-- MyComponent.vue -->
<template>
  <view class="formview">
  	<uni-forms ref="dealForm" :rules="rules" :modelValue="modelValue" label-width="80">
  		<uni-forms-item v-for="(item1, index1) in formJson" :key="index1" :label="item1.options.label" :name="item1.options.name" :required="item1.options.required">
  			<uni-easyinput 
  			    v-if="item1.type == 'input'" 
  				v-model="modelValue[item1.options.name]" 
				:maxlength="item1.options.maxLength ? item1.options.maxLength : 50"
  			/>
			<textarea v-if="item1.type == 'textarea'" v-model="modelValue[item1.options.name]" :maxlength="item1.options.maxLength" auto-height />
			<uni-number-box 
			    v-if="item1.type == 'number'" 
				v-model="modelValue[item1.options.name]" 
				:min="item1.options.min ? item1.options.min : 0"
				:max="item1.options.max ? item1.options.max : 100"
				:step="item1.options.step ? item1.options.step : 1"
			/>
  			<uni-data-checkbox 
  			    v-if="item1.type == 'radio'" 
  				v-model="modelValue[item1.options.name]" 
  				:localdata="item1.options.optionItems"
  			/>
			<uni-data-checkbox
			    v-if="item1.type == 'checkbox'" 
				multiple 
				v-model="modelValue[item1.options.name]" 
				:localdata="item1.options.optionItems"
			/>
			<uni-data-select
				v-if="item1.type == 'select'"
				v-model="modelValue[item1.options.name]"
				:localdata="item1.options.optionItems"
			></uni-data-select>
			<picker mode="time" v-if="item1.type == 'time'" :value="modelValue[item1.options.name]"></picker>
			<uni-datetime-picker v-if="item1.type == 'date'" :type="item1.options.type" v-model="modelValue[item1.options.name]"/>
			<uni-datetime-picker v-if="item1.type == 'date-range'" :type="item1.options.type" v-model="modelValue[item1.options.name]"/>
			<switch v-if="item1.type == 'switch'" :checked="item1.options.defaultValue" />
			<uni-rate v-if="item1.type == 'rate'" v-model="modelValue[item1.options.name]" :max="item1.options.max ? item1.options.max : 5" />
			<slider 
			    v-if="item1.type == 'slider'" 
				:value="item1.options.defaultValue" 
				:min="item1.options.min ? item1.options.min : 0"
				:max="item1.options.max ? item1.options.max : 100"
				:step="item1.options.step ? item1.options.step : 1"
			/>
  		</uni-forms-item>
  		<button plain="true" type="primary" @click="submit('dealForm')">提交</button>
  		<button plain="true" type="default" @click="reject('dealForm')" style="margin-top: 10px;" v-if="showReject">驳回</button>
  	</uni-forms>
  </view>
</template>
 
<script>
	import {
		dealWork,
	} from "@/utils/api/api.js"
	
	export default {
		props:{
			formJson:{
				type: Array,
				default: []
			},
			rules:{
				type: Object,
				default: {}
			},
			modelValue:{
				type: Object,
				default: {}
			},
			showReject:{
				type: Boolean,
				default: true
			},
		},
		data() {
			return {
				
			}
		},
		methods: {
			submit(ref) {
				this.$refs[ref].validate().then(s => {
					this.modelValue.isSave = 0;
					this.modelValue.direction = 1;
					dealWork(this.modelValue).then(res => {
						if (res.code == 1) {
							uni.navigateBack({
								success: () => {
									uni.$emit('refreshData'); // 派发全局事件
								}
							})
							uni.showToast({
								title: res.data,
								duration: 2000,
								mask: true,
								icon: 'none'
							});
						} else {
							uni.showToast({
								title: res.msg,
								duration: 2000,
								mask: true,
								icon: 'none'
							});
						}
					})
				}).catch(err => {
					console.log('err', err);
				})
			},
			reject(ref) {
				this.$refs[ref].validate().then(s => {
					this.modelValue.isSave = 0;
					this.modelValue.direction = 0;
					dealWork(this.modelValue).then(res => {
						if (res.code == 1) {
							uni.navigateBack({
								success: () => {
									uni.$emit('refreshData'); // 派发全局事件
								}
							})
							uni.showToast({
								title: res.data,
								duration: 2000,
								mask: true,
								icon: 'none'
							});
						} else {
							uni.showToast({
								title: res.msg,
								duration: 2000,
								mask: true,
								icon: 'none'
							});
						}
					})
				}).catch(err => {
					console.log('err', err);
				})
			},
		}
	}
</script>
 
<style scoped>
    .formview {
    	padding: 15px;
    	background-color: #fff;
    }
</style>